<template>
    <div class="filter">
        <div class="filter-item">
            <label for="">所属单位：</label>
            <el-select
                v-model="searchForm.depId"
                class="m-2"
                placeholder="请选择所属单位"
                style="width: 145px"
                :disabled="localTypeUnit != '1'"
                @change="depIdChange"
            >
                <el-option
                    v-for="item in depIdList"
                    :key="item.value"
                    :label="item.label"
                    :value="item.value"
                />
            </el-select>
        </div>
        <div class="filter-item">
            <label for="">设备分类：</label>
            <el-input
                v-model="searchForm.facilitySort"
                placeholder="请输入设备分类"
                style="width: 145px"
            />
        </div>
        <div class="filter-item">
            <label for="">设备地点：</label>
            <el-input
                v-model="searchForm.facilityLocations"
                placeholder="请输入设备地点"
                style="width: 145px"
            />
        </div>
        <div class="filter-item">
            <label for="">设备名称：</label>
            <el-input
                v-model="searchForm.facilityName"
                placeholder="请输入设备名称"
                style="width: 145px"
            />
        </div>
        <div class="filter-item">
            <label for="">设备唯一识别码：</label>
            <el-input
                v-model="searchForm.facilityNumber"
                placeholder="请输入设备唯一识别码"
                style="width: 145px"
            />
        </div>
        <div class="filter-item">
            <label for="">设备状态：</label>
            <el-select
                v-model="searchForm.facilityState"
                class="m-2"
                placeholder="请选择设备状态"
                style="width: 145px"
            >
                <el-option
                    v-for="item in facilityStateList"
                    :key="item.value"
                    :label="item.label"
                    :value="item.value"
                />
            </el-select>
        </div>
        <div class="filter-item">
            <label for="">设备分级：</label>
            <el-select
                v-model="searchForm.facilityLevel"
                class="m-2"
                placeholder="请选择设备分级"
                style="width: 145px"
            >
                <el-option
                    v-for="item in facilityLevelList"
                    :key="item.value"
                    :label="item.label"
                    :value="item.value"
                />
            </el-select>
        </div>
        <div class="filter-item">
            <label for="">规格型号：</label>
            <el-input
                v-model="searchForm.specificationModel"
                placeholder="请输入规格型号"
                style="width: 145px"
            />
        </div>
        <div class="filter-item">
            <label for="">供应商/厂家：</label>
            <el-input
                v-model="searchForm.facilitySupplier"
                placeholder="请输入供应商/厂家"
                style="width: 145px"
            />
        </div>
        <div class="filter-item">
            <label for="">资产编号：</label>
            <el-input
                v-model="searchForm.assetNumber"
                placeholder="请输入资产编号"
                style="width: 145px"
            />
        </div>
        <div class="filter-item">
            <label for="">保养计划：</label>
            <el-select
                v-model="searchForm.hasUpkeepPlan"
                class="m-2"
                placeholder="请选择保养计划"
                style="width: 145px"
            >
                <el-option
                    v-for="item in hasUpkeepPlanList"
                    :key="item.value"
                    :label="item.label"
                    :value="item.value"
                />
            </el-select>
        </div>

        <div class="filter-item">
            <label for="">标签名称：</label>
            <el-select
                v-model="searchForm.tagName"
                class="m-2"
                placeholder="请选择标签名称"
                style="width: 145px"
                clearable
            >
                <el-option
                    v-for="item in labelList"
                    :key="item.tagName"
                    :label="item.tagName"
                    :value="item.tagName"
                />
            </el-select>
        </div>
        <div class="filter-item">
            <el-button
                type="primary"
                @click="search"
            >查询</el-button>
        </div>
        <div class="filter-item">
            <el-button
                type="primary"
                @click="reset"
            >重置</el-button>
        </div>
    </div>
    <div class="options">
        <div class="overview">
            <!-- 设备概括 -->
            <el-tag class="ml-2">设备总数({{ equipmentOverview.total }})</el-tag>
            <el-tag
                class="ml-2"
                type="success"
            >正常({{ equipmentOverview.useCount }})</el-tag>
            <el-tag
                class="ml-2"
                type="info"
            >备用({{ equipmentOverview.standbyCount }})</el-tag>
            <el-tag
                class="ml-2"
                type="warning"
            >维修({{ equipmentOverview.repairCount }})</el-tag>
            <el-tag
                class="ml-2"
                type="danger"
            >已报废({{ equipmentOverview.scrapCount }})</el-tag>
        </div>
        <div class="operations">
            <el-button
                type="success"
                @click="handlerUpkeepPlan('batchAdd')"
            >批量保养计划</el-button>
        </div>
    </div>

    <div class="choiceListNumb">
        <span>已选: {{ rowDataList.length || 0 }} 项</span>
        <el-button
            type="text"
            @click="clearSelect"
        >清除</el-button>
    </div>
    <div
        class="dataList"
        id="eqdataList"
    >
        <el-table
            ref="multipleTableRef"
            :data="dataList"
            style="width: 100%"
            :row-key="getRowKey"
            @selection-change="handleSelectionChange"
            border
            size="small"
            :height="hHeight - 90 + 'px'"
        >
            <el-table-column
                type="selection"
                width="55"
                align="center"
                :reserve-selection="true"
            />
            <el-table-column
                label="所属单位"
                prop="depId"
                align="center"
                width="72"
            >
                <template #default="scope">
                    <div>{{ depIdName(scope.row.depId) }}</div>
                </template>
            </el-table-column>
            <el-table-column
                label="设备名称"
                prop="facilityName"
                align="center"
                width="122"
            />
            <el-table-column
                label="设备分类"
                prop="facilitySort"
                align="center"
                width="72"
            />
            <el-table-column
                label="设备分级"
                prop="facilityLevel"
                align="center"
                width="66"
            />
            <el-table-column
                label="规格型号"
                prop="specificationModel"
                align="center"
                width="140"
            />
            <el-table-column
                label="设备唯一识别码"
                prop="facilityNumber"
                align="center"
                width="160"
            />
            <el-table-column
                label="设备地点"
                prop="facilityLocations"
                align="center"
                width="132"
            />
            <el-table-column
                label="资产编号"
                prop="assetNumber"
                width="66"
                align="center"
            />
            <el-table-column
                label="设备状态"
                prop="facilityState"
                align="center"
                width="72"
            >
                <template #default="scope">
                    <div>{{ facilityStateName(scope.row.facilityState) }}</div>
                </template>
            </el-table-column>
            <el-table-column
                label="数量"
                prop="facilityNumbers"
                align="center"
                width="50"
            />
            <el-table-column
                label="单位"
                prop="unit"
                align="center"
                width="50"
            />
            <el-table-column
                label="供应商/厂家"
                prop="facilitySupplier"
                width="142"
                align="center"
            />
            <el-table-column
                label="是/否纳入特许经营权"
                prop="franchising"
                width="78"
                align="center"
            />
            <el-table-column
                label="采购时间"
                prop="purchaseTime"
                width="90"
                align="center"
            />
            <el-table-column
                label="开始使用时间"
                prop="startTime"
                width="90"
                align="center"
            />
            <el-table-column
                label="主要技术参数"
                prop="technicalParameter"
                width="400"
                align="center"
            />
            <el-table-column
                label="操作"
                fixed="right"
                width="185"
                align="center"
            >
                <template #default="scope">
                    <el-button
                        type="primary"
                        size="small"
                        @click="handleRepairRecord(scope.row)"
                    >保养记录</el-button>
                    <el-button
                        type="primary"
                        size="small"
                        @click="handleStartRepair(scope.row)"
                    >保养计划</el-button>
                </template>
            </el-table-column>
        </el-table>

        <el-pagination
            v-model:current-page="searchForm.pageNo"
            v-model:page-size="searchForm.pageSize"
            layout="total, sizes, prev, pager, next, jumper"
            :page-sizes="[10, 20, 50, 100, 200]"
            :total="total"
            @size-change="handleSizeChange"
            @current-change="handleCurrentChange"
            class="paginationStyle"
        />
    </div>
    <el-dialog
        v-model="recordListVisible"
        title="保养记录"
        width="1100"
    >
        <div style="margin: 0px 20px 0">
            <el-row :gutter="20">
                <el-col :span="8">
                    <div class="grid-content">
                        <label for="">设备名称：</label>
                        <span>{{ currentRowDate.facilityName }}</span>
                    </div>
                </el-col>
                <el-col :span="8">
                    <div class="grid-content">
                        <label for="">唯一识别码：</label>
                        <span>{{ currentRowDate.facilityNumber }}</span>
                    </div>
                </el-col>
                <el-col :span="8">
                    <div class="grid-content">
                        <label for="">设备状态：</label>
                        <span>{{
                            currentRowDate.facilityState == "1"
                                ? "在用"
                                : "停用"
                        }}</span>
                    </div>
                </el-col>
                <el-col :span="8">
                    <div class="grid-content">
                        <label for="">所属单位：</label>
                        <span>{{
                            depNameTranslate(currentRowDate.depId)
                        }}</span>
                    </div>
                </el-col>
                <el-col :span="8">
                    <div class="grid-content">
                        <label for="">设备地点：</label>
                        <span>{{ currentRowDate.facilityLocations }}</span>
                    </div>
                </el-col>
                <el-col :span="8">
                    <div class="grid-content">
                        <label for="">设备分类：</label>
                        <span>{{ currentRowDate.facilitySort }}</span>
                    </div>
                </el-col>
                <el-col :span="8">
                    <div class="grid-content">
                        <label for="">设备分级：</label>
                        <span>{{ currentRowDate.facilityLevel }}</span>
                    </div>
                </el-col>
                <el-col :span="8">
                    <div class="grid-content">
                        <label for="">规格型号：</label>
                        <span>{{ currentRowDate.specificationModel }}</span>
                    </div>
                </el-col>
                <el-col :span="8">
                    <div class="grid-content">
                        <label for="">资产编号：</label>
                        <span>{{ currentRowDate.assetNumber }}</span>
                    </div>
                </el-col>
                <el-col :span="8">
                    <div class="grid-content">
                        <label for="">数量：</label>
                        <span>{{ currentRowDate.facilityNumbers }}</span>
                    </div>
                </el-col>
                <el-col :span="8">
                    <div class="grid-content">
                        <label for="">单位：</label>
                        <span>{{ currentRowDate.unit }}</span>
                    </div>
                </el-col>
                <el-col :span="8">
                    <div class="grid-content">
                        <label for="">供应商/厂家：</label>
                        <span>{{ currentRowDate.facilitySupplier }}</span>
                    </div>
                </el-col>
                <el-col :span="8">
                    <div class="grid-content">
                        <label for="">采购时间：</label>
                        <span>{{ currentRowDate.purchaseTime }}</span>
                    </div>
                </el-col>
                <el-col :span="8">
                    <div class="grid-content">
                        <label for="">开始使用时间：</label>
                        <span>{{ currentRowDate.startTime }}</span>
                    </div>
                </el-col>
                <el-col :span="8">
                    <div class="grid-content">
                        <label for="">是/否纳入特许经营权：</label>
                        <span>{{ currentRowDate.franchising }}</span>
                    </div>
                </el-col>
                <el-col :span="24">
                    <div class="grid-content">
                        <label for="">主要技术参数：</label>
                        <span>{{ currentRowDate.technicalParameter }}</span>
                    </div>
                </el-col>
            </el-row>
        </div>

        <el-button
            type="primary"
            @click="exportUpkeepRecords"
        >导出记录</el-button>
        <el-table
            :data="repairRecordList"
            border
            style="margin-top: 10px"
        >
            <el-table-column
                type="index"
                label="序号"
                width="55"
            />
            <el-table-column
                prop="upkeepDesc"
                label="保养内容"
            />
            <el-table-column
                prop="upkeepLevel"
                label="保养级别"
            >
                <template #default="scope">
                    {{
                        scope.row.upkeepLevel == "1"
                            ? "一级保养"
                            : scope.row.upkeepLevel == "2"
                            ? "二级保养"
                            : "三级保养"
                    }}
                </template>
            </el-table-column>
            <el-table-column
                prop="name"
                label="主要项目"
            >
                <el-table-column
                    prop="lube"
                    label="润滑油、脂"
                />
                <el-table-column
                    prop="sealingElement"
                    label="密封件"
                />
                <el-table-column
                    prop="other"
                    label="其他"
                />
            </el-table-column>
            <el-table-column
                prop="planDate"
                label="计划保养日期"
            />
            <el-table-column
                prop="upkeepTime"
                label="保养完成日期"
            />
            <el-table-column
                prop="upkeepUser"
                label="保养人"
            />
            <el-table-column
                prop="acceptanceUser"
                label="验收人"
            />
        </el-table>
        <template #footer>
            <div class="dialog-footer">
                <el-button @click="recordListVisible = false">关闭</el-button>
            </div>
        </template>
    </el-dialog>

    <el-dialog
        v-model="toRepairVisible"
        title="保养计划"
        width="1100"
    >
        <div
            class="filter"
            style="margin-top: -15px"
        >
            <div class="filter-item">
                <label for="">保养级别：</label>
                <el-select
                    v-model="upkeepSearchForm.upkeepLevel"
                    class="m-2"
                    placeholder="请选择保养级别"
                    style="width: 125px"
                >
                    <el-option
                        v-for="item in upkeepLevelList"
                        :key="item.value"
                        :label="item.label"
                        :value="item.value"
                    />
                </el-select>
            </div>
            <div class="filter-item">
                <label for="">状态：</label>
                <el-select
                    v-model="upkeepSearchForm.status"
                    class="m-2"
                    placeholder="请选择状态"
                    style="width: 125px"
                >
                    <el-option
                        v-for="item in statusList"
                        :key="item.value"
                        :label="item.label"
                        :value="item.value"
                    />
                </el-select>
            </div>
            <div class="filter-item">
                <label for="">时间：</label>
                <el-date-picker
                    style="width: 200px"
                    v-model="upkeepSearchForm.dateTime"
                    type="daterange"
                    unlink-panels
                    range-separator="至"
                    start-placeholder="开始时间"
                    end-placeholder="结束时间"
                    :size="'default'"
                />
            </div>
            <div class="filter-item">
                <label for="">保养人：</label>
                <el-input
                    v-model="upkeepSearchForm.assetNumber"
                    placeholder="请输入资产编号"
                    style="width: 125px"
                />
            </div>
            <div class="filter-item">
                <el-button
                    size="default"
                    type="primary"
                    @click="upkeepPlanQueryPlan"
                >查询</el-button>
                <el-button
                    size="default"
                    type="primary"
                    @click="upkeepPlanReset"
                >重置</el-button>
            </div>
        </div>

        <div class="filter">
            <div class="filter-item">
                <el-button
                    size="default"
                    type="success"
                    @click="handlerUpkeepPlan('add')"
                >新增计划</el-button>
            </div>
        </div>

        <el-table
            :data="repairRecordList"
            style="margin-top: 10px"
        >
            <el-table-column
                type="index"
                label="序号"
                width="55"
            />
            <el-table-column
                prop="planName"
                label="保养计划名称"
            />
            <el-table-column
                prop="upkeepLevel"
                label="保养级别"
            >
                <template #default="scope">
                    {{ upkeepLevelName(scope.row.upkeepLevel) }}</template>
            </el-table-column>
            <el-table-column
                prop="upkeepInterval"
                label="保养频次"
            />
            <el-table-column
                prop="startDate"
                label="计划开始日期"
            />
            <el-table-column
                prop="endDate"
                label="计划结束日期"
            />
            <el-table-column
                prop="upkeepUserName"
                label="保养人"
            />
            <el-table-column
                prop="status"
                label="状态"
            >
                <template #default="scope">
                    {{ statusName(scope.row.status + "") }}</template>
            </el-table-column>
            <el-table-column
                fixed="right"
                label="操作"
                min-width="180"
            >
                <template #default="scope">
                    <el-button
                        text
                        type="primary"
                        size="small"
                        style="margin: 0"
                        @click="handlerUpkeepPlan('edit', scope.row)"
                    >
                        编辑
                    </el-button>
                    <el-button
                        text
                        type="primary"
                        size="small"
                        style="margin-left: 0"
                        @click="handlerUpkeepPlan('detail', scope.row)"
                    >
                        详情
                    </el-button>
                    <el-button
                        text
                        type="success"
                        size="small"
                        style="margin-left: 0"
                        @click="optionRecord(scope.row)"
                    >
                        操作记录
                    </el-button>
                    <el-button
                        text
                        type="danger"
                        size="small"
                        style="margin-left: 0"
                        @click="upkeepPlanDelete(scope.row)"
                    >
                        删除
                    </el-button>
                </template>
            </el-table-column>
        </el-table>

        <el-pagination
            v-model:current-page="upkeepSearchForm.pageNo"
            v-model:page-size="upkeepSearchForm.pageSize"
            layout="total, prev, pager, next, jumper"
            :total="upkeepPlanTotal"
            @size-change="handleSizeChangeUpkeepPlan"
            @current-change="handleCurrentChangeUpkeepPlan"
            class="paginationStyle"
        />
        <template #footer>
            <div class="dialog-footer">
                <el-button @click="toRepairVisible = false">取消</el-button>
            </div>
        </template>
    </el-dialog>

    <el-dialog
        v-model="oprateVisible"
        title="操作记录"
        width="1000"
    >
        <div class="filter">
            <div class="filter-item">
                <label for="">操作时间：</label>
                <el-date-picker
                    style="width: 240px"
                    v-model="recordTime"
                    type="daterange"
                    unlink-panels
                    range-separator="至"
                    start-placeholder="开始时间"
                    end-placeholder="结束时间"
                    :size="'default'"
                    :shortcuts="shortcuts"
                />
            </div>
            <div class="filter-item">
                <el-button
                    size="default"
                    type="warning"
                    @click="searchRecord(currentRowRecord)"
                >查询</el-button>
            </div>
        </div>
        <el-table
            :data="recordList"
            style="width: 100%"
        >
            <el-table-column
                prop="operationType"
                label="操作类型"
            />
            <el-table-column
                prop="createTime"
                label="操作时间"
                width="160"
            />
            <el-table-column
                prop="comment"
                label="操作内容"
                width="560"
            />
            <el-table-column
                prop="operationRealname"
                label="操作人"
            />
        </el-table>
        <el-pagination
            v-model:current-page="recordPageNo"
            v-model:page-size="recordPageSize"
            layout="total, prev, pager, next, jumper"
            :total="totalRecord"
            @size-change="handleSizeChangeRecord"
            @current-change="handleCurrentChangeRecord"
            class="paginationStyle"
        />
        <template #footer>
            <div class="dialog-footer">
                <el-button @click="oprateVisible = false">取消</el-button>
            </div>
        </template>
    </el-dialog>
    <el-dialog
        v-model="addVisible"
        :title="
            addVisibleType == 'add'
                ? '新增计划'
                : addVisibleType == 'edit'
                ? '编辑'
                : addVisibleType == 'batchAdd'
                ? '批量保养计划'
                : '详情'
        "
        width="940"
        :destroy-on-close="true"
    >
        <div
            v-if="addVisibleType == 'batchAdd'"
            style="margin-bottom: 10px"
        >
            <span style="line-height: 32px;">已选数据: {{ rowDataList.length || 0 }} 条</span>
        </div>
        <MaintenancePlan
            ref="maintenancePlan"
            :addEqDepId="addEqDepId"
            :addEqId="addEqId"
            :type="addVisibleType"
            @closedDialog="addPlanClosed"
        ></MaintenancePlan>
        <template #footer>
            <div class="dialog-footer">
                <el-button @click="addVisible = false">取消</el-button>
                <!-- <el-button @click="addVisible = false">中止</el-button> -->
                <el-button
                    v-if="addVisibleType !== 'detail'"
                    type="primary"
                    @click="submitForm()"
                >
                    保存
                </el-button>
            </div>
        </template>
    </el-dialog>
</template>
  
  <script setup>
import equipmentHttp from "@/https/equipment.js";
import labelHttp from "@/https/label.js";
import schedulingHttp from "@/https/scheduling.js";
import Storage from "@/utils/storage.js"; // storage工具类，简单的封装
import { ElMessage, ElMessageBox } from "element-plus";
import moment from "moment";
import { nextTick, onMounted, reactive, ref } from "vue";
import MaintenancePlan from "./maintenancePlan.vue";
let searchForm = reactive({
    assetNumber: "",
    depId: "",
    facilityLevel: "",
    facilityLocations: "",
    facilityName: "",
    facilityNumber: "",
    facilitySort: "",
    facilityState: "",
    facilitySupplier: "",
    specificationModel: "",
    hasUpkeepPlan: "",
    pageNo: 1,
    pageSize: 10,
});
const localTypeUnit = ref(Storage.localGet("depId"));
searchForm.depId = localTypeUnit.value;
let equipmentOverview = ref({});
const depIdList = ref([
    { label: "全部", value: "1" },
    { label: "星沙厂", value: "2" },
    { label: "城西厂", value: "3" },
    { label: "城北厂", value: "4" },
    { label: "城南厂", value: "5" },
    { label: "城东厂", value: "6" },
]);
const hasUpkeepPlanList = ref([
    { label: "全部", value: "" },
    { label: "有保养计划", value: "1" },
    { label: "无保养计划", value: "0" },
]);
const depIdName = (id) => {
    return id == "1"
        ? "公司"
        : id == "2"
            ? "星沙厂"
            : id == "3"
                ? "城西厂"
                : id == "4"
                    ? "城北厂"
                    : id == "5"
                        ? "城南厂"
                        : "城东厂";
};
const facilityStateName = (id) => {
    return id == "1"
        ? "在用"
        : id == "2"
            ? "备用"
            : id == "3"
                ? "维修"
                : id == "4"
                    ? "报废"
                    : "其他";
};
const facilityLevelList = ref([
    { label: "全部", value: "" },
    { label: "A", value: "A" },
    { label: "B", value: "B" },
    { label: "C", value: "C" },
    { label: "其他", value: "其他" },
]);
const facilitySortList = ref([]);
const facilityStateList = ref([
    { label: "在用", value: "1" },
    { label: "备用", value: "2" },
    { label: "维修", value: "3" },
    { label: "报废", value: "4" },
    { label: "其他", value: "5" },
]);

const depNameTranslate = (depId) => {
    let depName = "";
    depIdList.value.forEach((item) => {
        if (item.value == depId) {
            depName = item.label;
        }
    });
    return depName;
};
const dataList = ref([]);

const depIdChange = () => {
    searchForm.facilitySort = "";
    searchForm.tagName = ''
    getFacilitySort();
    getBatchlabelListSelect();
};

const hHeight = ref(0);
onMounted(() => {
    hHeight.value = document.documentElement.clientHeight - 350;
    search();
    getFacilitySort();
    getBatchlabelListSelect();
});

const labelList = ref([])
const getBatchlabelListSelect = async () => {
    let params = {
        depId: searchForm.depId == '1' ? '' : searchForm.depId,
        tagName: "",
        pageNo: 1,
        pageSize: 10000,
    }
    const res = await labelHttp.tagPageList(params);
    if (res.data.code === 200) {
        labelList.value = res.data.data.records;
    }
}
const getFacilitySort = () => {
    equipmentHttp.getFacilitySort(searchForm.depId).then((res) => {
        facilitySortList.value = [];
        res.data.data.forEach((item) => {
            facilitySortList.value.push({
                label: item,
                value: item,
            });
        });
    });
};
const facilitySituation = () => {
    equipmentHttp.facilitySituation(searchForm.depId).then((res) => {
        if (res.data.code == 200) {
            console.log(res.data);
            nextTick(() => {
                equipmentOverview.value = res.data.data;
            });
        }
    });
};
let total = ref(0);
const addEqId = ref("");
const addEqDepId = ref("");
const handleSizeChange = (val) => {
    searchForm.pageSize = val;
    search();
};
const handleCurrentChange = (val) => {
    searchForm.pageNo = val;
    search();
    console.log(`current page: ${val}`);
};
const search = () => {
    equipmentHttp.queryFacility(searchForm).then((res) => {
        if (res.data.code == 200) {
            dataList.value = res.data.data.records;
            total.value = res.data.data.total;
        }
    });
    facilitySituation();
};
let recordListVisible = ref(false);
const currentRowDate = ref({});

const repairRecordList = ref([]);

const handleRepairRecord = async (row) => {
    recordListVisible.value = true;
    currentRowDate.value = row;
    let params = {
        ...searchForm,
        equipId: row.id,
        facilityName: row.facilityName,
        assetNumber: row.assetNumber,
        status: "90",
    };
    equipmentHttp.upkeepTaskQueryTask(params).then((res) => {
        if (res.data.code == 200) {
            console.log(res.data.data);
            let arr = [];
            res.data.data.records.forEach((item) => {
                arr.push({ ...item, ...item.items });
            });
            repairRecordList.value = arr;
            console.log(repairRecordList.value, "equipRepairQueryRepairRecord");
        }
    });
    // const res = await equipmentHttp.equipRepairQueryRepairRecord(params);
    // if (res.data.code == 200) {
    //     console.log(res.data.data);
    //     res.data.data.records.forEach((item) => {
    //         item = { ...item, ...item.RepairDetail };
    //     });
    //     repairRecordList.value = res.data.data.records;
    // }
};

const exportUpkeepRecords = async () => {
    let params = {
        equipId: currentRowDate.value.id,
        facilityName: currentRowDate.value.facilityName,
        assetNumber: currentRowDate.value.assetNumber,
        status: "90",
    };
    equipmentHttp.upkeepTaskExportUpkeepRecord(params).then((response) => {
        console.log(response);
        const content = response.data;
        const blob = new Blob([content], { type: "application/ms-excel" });
        let fileName = `保养记录.xls`;
        if ("download" in document.createElement("a")) {
            // 非IE下载
            const elink = document.createElement("a");
            elink.download = fileName;
            elink.style.display = "none";
            elink.href = URL.createObjectURL(blob);
            document.body.appendChild(elink);
            elink.click();
            URL.revokeObjectURL(elink.href); // 释放URL 对象
            document.body.removeChild(elink);
        } else {
            // IE10+下载
            navigator.msSaveBlob(blob, fileName);
        }
    });
};
const reset = () => {
    searchForm.assetNumber = "";
    searchForm.depId = localTypeUnit.value;
    searchForm.facilityLevel = "";
    searchForm.facilityLocations = "";
    searchForm.facilityName = "";
    searchForm.facilityNumber = "";
    searchForm.facilitySort = "";
    searchForm.facilityState = "";
    searchForm.facilitySupplier = "";
    searchForm.specificationModel = "";
    searchForm.tagName = ''
    searchForm.pageNo = 1;
    searchForm.pageSize = 10;
    search();
};

let rowDataList = ref([]);
const handleSelectionChange = (rowData) => {
    console.log(rowData);
    rowDataList.value = rowData;
};

const getRowKey = (row) => {
    return row.id;
};
/******** 保养计划 *******/
// 搜索
let toRepairVisible = ref(false);
let upkeepSearchForm = reactive({
    upkeepLevel: "",
    upkeepUser: "",
    status: "",
    dateTime: [],
    pageNo: 1,
    pageSize: 10,
});
const currentEqRow = ref({});
const handleStartRepair = (row) => {
    toRepairVisible.value = true;
    currentEqRow.value = row;
    upkeepSearchForm.equipId = currentEqRow.value.id;
    upkeepSearchForm.depId = currentEqRow.value.depId + "";
    upkeepPlanQueryPlan();
};
const upkeepPlanReset = async () => {
    upkeepSearchForm.upkeepLevel = "";
    upkeepSearchForm.upkeepUser = "";
    upkeepSearchForm.status = "";
    upkeepSearchForm.dateTime = [];
    upkeepSearchForm.pageNo = 1;
    upkeepSearchForm.pageSize = 10;
    upkeepPlanQueryPlan();
};

let upkeepPlanTotal = ref(0);
const handleSizeChangeUpkeepPlan = (val) => {
    searchForm.pageSize = val;
    upkeepPlanQueryPlan();
};
const handleCurrentChangeUpkeepPlan = (val) => {
    searchForm.pageNo = val;
    upkeepPlanQueryPlan();
};
const upkeepPlanQueryPlan = async () => {
    let params = {
        equipId: currentEqRow.id,
        depId: currentEqRow.depId,
        ...upkeepSearchForm,
        startTime: upkeepSearchForm.dateTime[0]
            ? moment(upkeepSearchForm.dateTime[0]).format("YYYY-MM-DD")
            : "",
        endTime: upkeepSearchForm.dateTime[1]
            ? moment(upkeepSearchForm.dateTime[1]).format("YYYY-MM-DD")
            : "",
    };
    const res = await equipmentHttp.upkeepPlanQueryPlan(params);
    if (res.data.code == 200) {
        repairRecordList.value = res.data.data.records;
        upkeepPlanTotal.value = res.data.data.total;
    }
};

const upkeepLevelList = ref([
    { label: "全部", value: "" },
    { label: "一级", value: "1" },
    { label: "二级", value: "2" },
    { label: "三级", value: "3" },
]);

const upkeepLevelName = (id) => {
    return id == "1" ? "一级" : id == "2" ? "二级" : id == "3" ? "三级" : "";
};
const statusList = ref([
    { label: "全部", value: "" },
    { label: "未生成", value: "0" },
    { label: "已生产", value: "1" },
    // { label: "全部", value: "" },
    // { label: "未开始", value: "1" },
    // { label: "进行中", value: "2" },
    // { label: "已完成", value: "3" },
]);
const statusName = (id) => {
    return id == "0" ? "未生成" : id == "1" ? "已生成" : "";
    return id == "1"
        ? "未开始"
        : id == "2"
            ? "进行中"
            : id == "3"
                ? "已完成"
                : "";
};
const addPlanClosed = () => {
    addVisible.value = false;
    upkeepPlanQueryPlan();
};
const upkeepPlanDelete = (row) => {
    ElMessageBox.confirm("确认删除选中的计划吗？", "删除", {
        confirmButtonText: "确认",
        cancelButtonText: "取消",
        type: "warning",
    })
        .then(() => {
            equipmentHttp.upkeepPlanDeletePlan(row).then((res) => {
                console.log(res);
                if (res.data.code == 200) {
                    ElMessage({
                        message: "删除成功",
                        type: "success",
                    });
                    upkeepPlanQueryPlan();
                } else {
                    ElMessage({
                        message: "删除失败！",
                        type: "error",
                    });
                }
            });
        })
        .catch(() => {
            ElMessage({
                type: "info",
                message: "取消删除",
            });
        });
};
// 新增(批量)/编辑计划
const addVisible = ref(false);
const addVisibleType = ref("add");
const handlerUpkeepPlan = (type, row) => {
    if (type == "batchAdd") {
        if (rowDataList.value.length > 0) {
            let defaultId = rowDataList.value[0].depId;
            let isDiff = false;
            let rowids = [];
            rowDataList.value.forEach((item) => {
                rowids.push(item.id);
                if (defaultId != item.depId) {
                    isDiff = true;
                }
            });
            if (isDiff) {
                ElMessage({
                    type: "warning",
                    message: "请选择同一个厂的设备！",
                });
            } else {
                addEqDepId.value = defaultId + "";
                console.log(addEqDepId.value);
                addEqId.value = rowids.join(",");
                addVisibleType.value = type;
                addVisible.value = true;
            }
        } else {
            ElMessage({
                type: "warning",
                message: "请至少勾选一条数据！",
            });
        }
    } else if (type == "add") {
        console.log(currentEqRow.value);
        addEqId.value = currentEqRow.value.id;
        addEqDepId.value = currentEqRow.value.depId + "";
        addVisibleType.value = type;
        addVisible.value = true;
    } else {
        addEqId.value = row.id;
        addEqDepId.value = row.depId + "";
        addVisibleType.value = type;
        addVisible.value = true;
    }
};
const recordTime = ref([]);
const oprateVisible = ref(false);
const recordList = ref([]);
const currentRowRecord = ref();
const optionRecord = async (row) => {
    oprateVisible.value = true;
    currentRowRecord.value = row;
    recordTime.value[0] = moment().format("YYYY-MM-DD");
    recordTime.value[1] = moment().add(1, "day").format("YYYY-MM-DD");
    searchRecord(currentRowRecord.value);
};
const recordPageNo = ref(1);
const recordPageSize = ref(10);

let totalRecord = ref(0);
const handleSizeChangeRecord = (val) => {
    recordPageSize.value = val;
    searchRecord(currentRowRecord.value);
};
const handleCurrentChangeRecord = (val) => {
    recordPageNo.value = val;
    searchRecord(currentRowRecord.value);
};
const searchRecord = async (row) => {
    let params = {
        businessId: row.id,
        operationType: "",
        businessType: "设备保养",
        startTime:
            recordTime.value.length > 0
                ? moment(recordTime.value[0]).format("YYYY-MM-DD")
                : "",
        endTime:
            recordTime.value.length > 0
                ? moment(recordTime.value[1]).format("YYYY-MM-DD")
                : "",
        pageNo: recordPageNo.value,
        pageSize: recordPageSize.value,
    };
    const res = await schedulingHttp.operationRecordsQueryOperationRecords(
        params
    );
    console.log(res);
    if (res.data.code == 200) {
        recordList.value = res.data.data.records;
        totalRecord.value = res.data.data.total;
    }
};
const maintenancePlan = ref(null);
const submitForm = () => {
    maintenancePlan.value.submit();
};
const multipleTableRef = ref()
const clearSelect = () => {
    multipleTableRef.value.clearSelection();
};
</script>
  
  <style scoped lang="less">
.filter {
    flex-wrap: wrap;
    display: flex;
    flex-direction: row;
    align-items: center;
    .filter-item {
        margin: 0 15px 15px 0px;
        display: flex;
        flex-direction: row;
        align-items: center;
        label {
            font-size: 14px;
            color: #333;
            display: inline-block;
            white-space: nowrap;
        }
    }
}
.options {
    margin: 20px 0 15px;
    display: flex;
    justify-content: space-between;
    flex-direction: row;
    .ml-2 {
        margin-right: 10px;
    }
}
.preview {
    display: flex;
    flex-direction: row;
    align-items: center;
}
.equipmentPagination {
    justify-content: flex-end;
    margin-top: 10px;
}
.grid-content {
    line-height: 2;
}
:deep #eqdataList .el-table__header .cell {
    padding-left: 2px !important;
    padding-right: 2px !important;
}
:deep #eqdataList .el-table__cell {
    padding: 0 !important;
}
:deep #eqdataList .el-table__cell .cell {
    padding: 0 !important;
    font-size: 12px;
    text-align: center;
}
.choiceListNumb {
    line-height: 32px;
    display: flex;
    flex-direction: row;
    align-items: center;
    span {
        margin-right: 10px;
    }
}
</style>
  